<template>
	<view>
		<view><button @click="goBack">返回</button></view>
		<!-- <image class="logo" src="/static/logo.png"></image> -->
	    <view class="layout-form" v-model="FormData">
			<view class="layout-form-item" >
				<view class="form-label">问&nbsp;&nbsp;题: </view>
				<view class="form-type">
					<input  class="uni-input " v-model="FormData.name"/>
				</view>
			</view>
			<view class="layout-form-item" >
				<view class="form-label"><text>检 查 人：</text></view>
				<view class="form-type">
					<input  class="uni-input "  v-model="FormData.code" auto-height disabled="true"/>
				</view>
			</view>
			<view class="layout-form-item" >
				<view class="form-label">车  间: </view>
				<view class="form-type">
					<input  class="uni-input "  v-model="FormData.code" auto-height disabled="true"/>
				</view>
			</view>
			<view class="layout-form-item" >
				<view class="form-label">检查区域: </view>
				<view class="form-type">
					<input  class="uni-input "  v-model="FormData.code" auto-height/>
				</view>
			</view>
			<view class="layout-form-item" >
				<view class="form-label">检查时间: </view>
				<view class="form-type">
					<view class="example-body">
							<uni-datetime-picker type="date" :clear-icon="false" v-model="single" @maskClick="maskClick" />
					</view>
				</view>
			</view>
			<view class="layout-form-item" >
				<view class="form-label">问题描述: </view>
				<textarea  class="form-type-text" v-model="FormData.pass" auto-height/>
			</view>
			<view class="layout-form-item" >
				<view class="form-label">图片上传: </view>
					<view class="example-body">
						<uni-file-picker class="form-up-file" :file-mediatype="mediaType" ></uni-file-picker>
					</view>
			</view>
			<view class="layout-form-btn" >
				<button class="mini-btn" type="primary" @click="clickInter">提交</button>
			</view>
		</view>
		<view class="uni-btn">
		</view>
	</view>
</template>

<script>
	import { post } from '../../utils/request.js';
	export default {
		data() {
			return {
				title: '',
				FormData: {
					name: '',
					code: '',
					pass: ''
				},
				checkName:'检&ensp;车&ensp;人：',
				single:  new Date(),
				mediaType:['image', 'audio']
			}
		},
		onLoad() {

		},
		methods: {
			clickInter(){
				
			},
			goBack() {},
		    change(e) {
				this.single = e
				console.log('change事件:', this.single = e);
						},
			getDate(type) {
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();
				month = month > 9 ? month : '0' + month;
				day = day > 9 ? day : '0' + day;
				return `${year}-${month}-${day}`;
			},
			maskClick(e){
				console.log('maskClick事件:', e);
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.text-area{
		margin-top: 100px;
	}
	.layout-form {
		padding: 0 10px;
		margin-top: 30px;
		text-align: center;
		}
		.layout-form-item {
			padding: 30px 0;
			line-height: 37px;
			display: flex;	
		}
		.form-label {
			width: 20%;
			line-height: 35px;
			text-align: right;
			//font-size: 14px;
			color: #000;
			margin-right: 5px;
		}
		.form-type {
			//font-size: 12px;
			width: 80%;
		   line-height: 35px;
		}
		.form-type-input {
			text-align: left;
		    line-height: 35px;
			font-size: 12px;
		}
	.uni-input{
		position: relative;
		display: block;
		height: 100%;
		background: none;
		color: inherit;
		opacity: 1;
		font: inherit;
		line-height: inherit;
		letter-spacing: inherit;
		text-align: inherit;
			text-indent: inherit;
		text-transform: inherit;
		text-shadow: inherit;
		text-align: left;
		/* border: 2px; */
		border: 1px solid #999 !important;
		/* margin: 3px; */
	}
	.form-type-text {
		text-align: left;
		border: 1px solid #999 !important;
		line-height: 35px;
		border-radius: 5px;
		color: rgba(0, 0, 0, 0.6);
		/* margin: 3px; */
	}
	.layout-form-btn {
		text-align: center;
	}
	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
		}
	.text-area {
		display: flex;
		justify-content: center;
	}
	.uni-btn{
		margin-top: 20px;
		text-align: center;
		width: 100%;
	}
	.mini-btn{
		display: inline;
		width: 50%;
	}
	.form-up-file {
		margin-left: 10px;
	}
	.uni-left{
		text-align: center;
		width: 50%;
		display: inline-block;
	}
	.uni-right{
		text-align: center;
		width: 50%;
		display: inline-block;
	}
	.example-body {
		background-color: #fff;
    }
	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>
